<template>
    <h1>test2</h1>
    <div id="aaa">{{ $store.state.test2AAAValue }}</div>
</template>

<script>
export default {
    name: "Test2",
    data() {
        return {
            watcher: null
        }
    },
    // watch:{
    //     aa(){
    //         console.log(this.$store.state)
    //     }
    // },
    // computed:{
    //     aa(){
    //         return this.$store.state.test2AAAValue;
    //     }
    // },
    mounted() {
        this.watcher = this.$store.watch((state) => {
            // console.log('a', a, a == this.$store.state)
            return state.test2AAAValue;
        }, function (newValue,oldValue) {
            console.log('b', newValue,oldValue)
        })
        // console.log(this.watcher)
    },
    unmounted() {
        // 停止监视
        this.watcher && this.watcher()
    },
    methods: {
        changeAAA() {
        }
    }
}
</script>

<style scoped>

</style>